<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>javascript实现ajax功能</title>
		<style type="text/css">
			*{margin: 0;padding: 0;}
			body{font-size: 14px;}
			.divFrame{width: 260px;border: 1px solid red;}
			.divFrame .divTitle{padding: 5px;background: #eee;}
			.divFrame .divContent{padding: 8px;}
			.divFrame .divContent .clsShow{font-size: 14px;}
			.btn{border: 1px solid green;padding: 2px;width: 80px;filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ffffff,EndColorStr=#ECE0D8);}
			
		</style>
	</head>
	<body>
		<div class="divFrame">
			<div class="divTitle">
				<input type="button" id="button" onclick="GetSendData()" class="btn" value="获取数据"/>
			</div>
			<div class="divContent">
				<div id="divTip"></div>
			</div>
		</div>
		<script type="text/javascript">
			var objXmlHttp = null;//空的XmlHttp变量
			//浏览器的不同返回该变量的实体对象
			function CreateXMLHTTP(){
				if(window.ActiveXObject){
					objXmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
				}else if(window.XMLHttpRequest){
					objXmlHttp = new XMLHttpRequest();
				}else{
					alert("初始化HTTP错误！")
				}
			}
			
			function GetSendData(){
				document.getElementById("divTip").innerHTML = "<img alt='' title='正在加载.....' src='img/loading.gif'/>";
				//设置发送地址变量，赋值
				var strSendUrl = "b.html·data="+Date();//清空缓存中已经加载的变量数据信息
				CreateXMLHTTP();//实例化XMLHttpRequest对象
				//open方法初始化XMLHttpRequest
				objXmlHttp.open("GET","b.html",true);
				objXmlHttp.onreadystatechange = function(){
					if (objXmlHttp.readyState == 4) {
						//如果请求完成加载
						if (objXmlHttp.status == 200) {
							//如果响应已成功
							//显示获取的数据
							document.getElementById("divTip").innerHTML = objXmlHttp.responseText;
						}
						
					}
				}
				objXmlHttp.send();//发送设置的请求
			}
			
		</script>
	</body>
</html>
